{% extends "main.html" %}

{% block title %}HTTP Archive FAQ{% endblock %}

{% block description %}Frequently Asked Questions about the HTTP Archive: what we do and how we test and gather our data.{% endblock %}

{% block main %}
  <section id="FAQ" class="alt-light">
    <div class="container">
      <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
        <h1>
          <small>Frequently Asked Questions</small>
          FAQ
        </h1>

        <ul id="questions">
          {% for question, anchor in faq.anchors.items() %}
            <li class="question">
              <a href="#{{ anchor }}">{{ question }}</a>
            </li>
          {% endfor %}
        </ul>
      </div>
    </div>

    <div class="container">
      <div id="answers" class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
        {{ faq.FAQ | markdown }}
      </div>
    </div>
  </section>
{% endblock %}

{% block scripts %}
  {{ super() }}
  <script src="{{ get_versioned_filename('/static/js/faq.js') }}"></script>
  <script nonce="{{ csp_nonce() }}">
addEventListener('DOMContentLoaded', function() {
  generateQuestionAnchors({{ faq.anchors|tojson }});
});
generateChangelog();
  </script>
{% endblock %}
